<template>
  <div class="teamFollowUp">
    <Chart1 ref="Chart3" :option="option" :containerStyle="{height: '400px',paddingLeft: '20px'}"/>
  </div>
</template>

<script>
import {
  queryFollowCount
} from '@/api/dashboard/index';
import Chart1 from '@/charts/preSale/chart1';
export default {
  name: 'teamFollowUp',
  components: {
    Chart1
  },
  props: {
    rowDate: {
      type: Object,
      default: () => ({})
    },
    consultData: {
      type: Array,
      default: () => ([])
    },
    consultOption: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      option:{}
    }
  },
  mounted() {
    this.queryFollowCount()
  },
  methods: {
    async queryFollowCount() {
      // console.log(this.consultOption)
      const res = await queryFollowCount(this.rowDate);
      if (res.resultCode === 200) {
        // let consultOption = this.consultOption;
        let xAxisData = [],followedCount=[],unFollowCount=[],expireFollowedCount=[],expireUnFollowCount=[];
        res.data.list.map(x=>{
          xAxisData.push(x.consultantName)
          followedCount.push(x.followedCount)
          unFollowCount.push(x.unFollowCount)
          expireFollowedCount.push(x.expireFollowedCount)
          expireUnFollowCount.push(x.expireUnFollowCount)
        })
        this.consultOption.xAxis.data = xAxisData
        this.consultOption.series[0].data = followedCount
        this.consultOption.series[1].data = expireFollowedCount
        this.consultOption.series[2].data = unFollowCount
        this.consultOption.series[3].data = expireUnFollowCount

        this.option = this.consultOption;
      }
    },
  },
};
</script>

<style scoped lang="less">
.text {
  text-align: center;
  font-size: 26px;
  padding-top: 30vh;
}
</style>
